<template>
  <div>
    <!-- <el-drawer :title=title :visible.sync="drawer" :direction="direction"
    :before-close="handleClose_" :size="size" :label-list="labelList">-->
    <!-- <el-tabs tab-position="left">
        <el-tab-pane v-for="(labelItem,index) in labelList" :label="labelItem.name" :key="index">
          <div :content="labelItem" v-for="(dataItem,index) in labelItem.data" :key="index">

          </div>
        </el-tab-pane>
    </el-tabs>-->
    <!-- </el-drawer> -->
  </div>
</template>

<script>
export default {
  name: 'DrawerForm',
  props: {
    title: {
      type: String,
      default: ''
    },
    drawer: {
      type: Boolean,
      default: false
    },
    direction: {
      type: String,
      default: 'rtl'
    },
    size: {
      type: String,
      default: '30%'
    },
    labelList: {
      // 左侧标题
      type: Array,
      default: () => []
    },
    content: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {};
  },
  computed: {},

  methods: {
    handleClose_() {
      this.$emit('closeDrawer');
    }
  }
};
</script>

<style type="text/css">
:focus {
  outline: 0;
}
.el-drawer.rtl {
  overflow: scroll;
}
.el-drawer__header {
  margin-bottom: 0;
  padding: 20px;
  border: 1px solid #f0f0f0;
}
.el-drawer__container ::-webkit-scrollbar {
  display: none;
}
.el-tabs--left,
.el-tabs--right {
  height: 100%;
}
.el-tabs--left .el-tabs__header.is-left {
  background-color: #f4f4f4;
}
.el-tabs--left .el-tabs__item.is-left {
  width: 150px;
  height: 90px;
  line-height: 90px;
  text-align: center;
}
.el-tabs__item.is-active {
  color: #303133;
  background: #fff;
}
.el-tabs__content {
  padding: 25px;
}
#el-drawer__title > span {
  text-align: center;
}
</style>
